<script setup lang="ts">
import EnterpriseElement from "@/components/common/enterpriseElement.vue";
import UserElement from "@/components/common/userElement.vue";
import RecruitmentElement from "@/components/common/RecruitmentElement.vue";

const props = defineProps({
  data: {
    type: Object,
    require: true,
  },
  type: {
    type: String,
    default: 'enterprise' //'enterprise' | 'user' | 'recruit' |
  }
});
</script>

<template>
  <span class="ele-wrapper">
    <template v-if="props.type == 'enterprise'">
      <enterprise-element :data="props.data"></enterprise-element>
    </template>
    <template v-else-if="props.type == 'user'">
      <user-element :data="props.data"></user-element>
    </template>
    <template v-else-if="props.type == 'recruit'">
      <RecruitmentElement :data="props.data"></RecruitmentElement>
    </template>
    <template v-else>
      出错了
    </template>
  </span>
</template>

<style scoped>
.ele-wrapper {
  display: flex;
  justify-content: space-between;
  padding: 20px;
  margin: 20px;
  width: 500px;
  border: 1px solid var(--color-border);
  border-radius: 20px;
}
</style>